﻿<Fluent:RibbonWindow x:Class="MockupDesigner.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:s="clr-namespace:MockupDesigner.AppItems"
        xmlns:cmd="clr-namespace:MockupDesigner.AppItems.Commands"
        xmlns:c="clr-namespace:MockupDesigner.AppItems.Controls"
        xmlns:d="clr-namespace:MockupDesigner.AppItems.Documents"
        xmlns:slg="clr-namespace:PropertyGrid;assembly=PropertyGrid"
        xmlns:Fluent="clr-namespace:Fluent;assembly=Fluent"
        xmlns:w="clr-namespace:MockupDesigner"
        xmlns:control="clr-namespace:MockupDesigner.AppItems.Controls"
        Title="Mockup Designer"
        WindowStartupLocation="CenterScreen"
        WindowState="Maximized"
        Height="850" Width="1000">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--<ContentControl Grid.Row="0" Content="{StaticResource MyToolbar}"/> Old Ribbon-->

        <Fluent:Ribbon Grid.Row="0" ShowQuickAccessToolBarAboveRibbon="True" >
            <Fluent:Ribbon.QuickAccessItems>
                <Fluent:QuickAccessMenuItem IsChecked="True">
                    <Fluent:Button Text="Save" Icon="Resources/Images/Save.png"
                                Command="{x:Static ApplicationCommands.Save}" />
                </Fluent:QuickAccessMenuItem>
                <Fluent:QuickAccessMenuItem IsChecked="True">
                    <Fluent:Button Text="Undo" Icon="Resources/Images/Undo.png"
                                Command="{x:Static ApplicationCommands.Undo}"  />
                </Fluent:QuickAccessMenuItem>
                <Fluent:QuickAccessMenuItem IsChecked="True">
                    <Fluent:Button Text="Redo" Icon="Resources/Images/Redo.png"
                                Command="{x:Static ApplicationCommands.Redo}"/>
                </Fluent:QuickAccessMenuItem>
            </Fluent:Ribbon.QuickAccessItems>

            <Fluent:RibbonTabItem  Header="Home" >
                <Fluent:RibbonGroupBox Header="Edit">
                    <Fluent:Button Text="Paste" LargeIcon="Resources/Images/PasteBig.png" 
                                    Command="{x:Static ApplicationCommands.Paste}" />
                    <Fluent:Button SizeDefinition="Middle" Text="Cut" Icon="Resources/Images/Cut.png" 
                                   Command="{x:Static ApplicationCommands.Cut}" />
                    <Fluent:Button SizeDefinition="Middle" Text="Copy" Icon="Resources/Images/Copy.png"
                                   Command="{x:Static ApplicationCommands.Copy}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Delete" Icon="Resources/Images/Delete.png" 
                                    Command="{x:Static ApplicationCommands.Delete}"/>
                </Fluent:RibbonGroupBox>
                <Fluent:RibbonGroupBox Header="Alignment">
                    <Fluent:Button SizeDefinition="Middle" Text="Left" Icon="Resources/Images/AlignObjectsLeft.png" 
                                    Command="{x:Static cmd:MDCommands.AlignLeft}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Center" Icon="Resources/Images/AlignObjectsCenteredHorizontal.png" 
                                    Command="{x:Static cmd:MDCommands.AlignHorizontalCenters}" />
                    <Fluent:Button SizeDefinition="Middle" Text="Right" Icon="Resources/Images/AlignObjectsRight.png" 
                                   Command="{x:Static cmd:MDCommands.AlignRight}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Top" Icon="Resources/Images/AlignObjectsTop.png" 
                                   Command="{x:Static cmd:MDCommands.AlignTop}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Center" Icon="Resources/Images/AlignObjectsCenteredVertical.png"
                                   Command="{x:Static cmd:MDCommands.AlignVerticalCenters}" />
                    <Fluent:Button SizeDefinition="Middle" Text="Bottom" Icon="Resources/Images/AlignObjectsBottom.png" 
                                   Command="{x:Static cmd:MDCommands.AlignBottom}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Horizontal" Icon="Resources/Images/DistributeObjectsHorizontal.png"
                                   Command="{x:Static cmd:MDCommands.DistributeHorizontal}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Vertical" Icon="Resources/Images/DistributeObjectsVertical.png" 
                                   Command="{x:Static cmd:MDCommands.DistributeVertical}" />
                </Fluent:RibbonGroupBox>
                <Fluent:RibbonGroupBox Header="Group">
                    <Fluent:Button SizeDefinition="Middle" Text="Group" Icon="Resources/Images/Group.png" 
                                   Command="{x:Static cmd:MDCommands.Group}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Ungroup" Icon="Resources/Images/Ungroup.png" 
                                   Command="{x:Static cmd:MDCommands.Ungroup}"/>
                </Fluent:RibbonGroupBox>
                <Fluent:RibbonGroupBox Header="Arrange">
                    <Fluent:Button SizeDefinition="Middle" Text="Fordward" Icon="Resources/Images/BringForward.png"
                                   Command="{x:Static cmd:MDCommands.BringForward}"
                                   CommandTarget="{Binding  ElementName=DocumentsTC, Path=SelectedItem.DesignerCanvas}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Backward" Icon="Resources/Images/SendBackward.png"
                                   Command="{x:Static cmd:MDCommands.SendBackward}"
                                   CommandTarget="{Binding  ElementName=DocumentsTC, Path=SelectedItem.DesignerCanvas}"/>
                    <Fluent:Button SizeDefinition="Middle" IsEnabled="False"  />
                    <Fluent:Button SizeDefinition="Middle" Text="To Front" Icon="Resources/Images/BringToFront.png"
                                   Command="{x:Static cmd:MDCommands.BringToFront}"/>
                    <Fluent:Button SizeDefinition="Middle" Text="Send Back" Icon="Resources/Images/SendToBack.png" 
                                   Command="{x:Static cmd:MDCommands.SendToBack}"/>
                </Fluent:RibbonGroupBox>
            </Fluent:RibbonTabItem>

            <Fluent:Ribbon.BackstageItems>
                <Fluent:Button Text="New..." Icon="Resources/Images/GenericDocument.png" 
                               Command="{x:Static ApplicationCommands.New}" />
                <Fluent:Button Text="Open..." Icon="Resources/Images/OpenFolder.png" 
                               Command="{x:Static ApplicationCommands.Open}"/>
                <Fluent:Button Text="Save" Icon="Resources/Images/Save.png"
                                Command="{x:Static ApplicationCommands.Save}" />
                <Fluent:Button Text="Save As..."
                                Command="{x:Static ApplicationCommands.SaveAs}" />
                <Fluent:Button Text="Export As Image..." Icon="Resources/Images/Export.png" 
                               Command="{x:Static cmd:MDCommands.ExportAsImage}" />
                <Fluent:Button Text="Export Metadatas..." Icon="Resources/Images/ExportCSV.png" 
                               Command="{x:Static cmd:MDCommands.ExportMetadatas}" />
                <Fluent:Button Text="Print..." Icon="Resources/Images/Print.png"
                               Command="{x:Static ApplicationCommands.Print}" />
                <Fluent:Button Text="About..." 
                               Command="{x:Static cmd:MDCommands.About}" />
                <Fluent:Button Text="Exit"
                               Command="{x:Static ApplicationCommands.Close}" />
            </Fluent:Ribbon.BackstageItems>

        </Fluent:Ribbon>

        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="245"/>
                <ColumnDefinition />
                <ColumnDefinition Width="200" />
            </Grid.ColumnDefinitions>
            <!-- Toolbox -->
            <ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Column="0">
                <StackPanel Name="ToolboxesSP" Grid.Column="0" Margin="0,0,5,0">
                    <Expander Header="Common Controls" Content="{StaticResource CommonToolbox}" IsExpanded="True"/>
                    <Expander Header="Containers" Content="{StaticResource ContainersToolbox}" IsExpanded="False"/>
                    <Expander Header="Data" Content="{StaticResource DataToolbox}" IsExpanded="False"/>
                    <Expander Header="Menus" Content="{StaticResource MenusToolbox}" IsExpanded="False"/>
                    <Expander Header="Shapes" Content="{StaticResource ShapesToolbox}" IsExpanded="False"/>
                    <!--<Button x:Name="switchThemeBT" Content="Switch Theme"/>-->
                </StackPanel>
            </ScrollViewer>
            <!-- GridSplitter -->
            <GridSplitter Focusable="False" Width="2" Background="LightGray" Grid.Column="1" 
                   ResizeDirection="Columns" VerticalAlignment="Stretch" HorizontalAlignment="Left"/>
            <!-- Designer -->
            <!--<GroupBox Header="Diagram" Grid.Column="1" Margin="3,0,3,0">
                <ScrollViewer HorizontalScrollBarVisibility="Auto"
                      VerticalScrollBarVisibility="Auto" >-->
            <TabControl Grid.Column="1" Margin="3,0,3,0" x:Name="DocumentsTC" SelectionChanged="DocumentsTC_SelectionChanged" >
                <TabControl.ItemContainerStyle>
                    <Style TargetType="{x:Type TabItem}">
                        <Style.Setters>
                            <Setter Property="HeaderTemplate">
                                <Setter.Value>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal" MouseDown="StackPanel_MouseDown" >
                                            <TextBlock VerticalAlignment="Center" Text="{Binding}"/>
                                            <Button Margin="10,0,-5,0" Command="{x:Static cmd:MDCommands.CloseDocument}"  CommandParameter="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type TabItem}}, Path=Content}" >
                                                <Button.Template>
                                                    <ControlTemplate>
                                                        <Border BorderThickness="1" Name="BorderBT" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
                                                            <TextBlock Padding="2,2,2,2" VerticalAlignment="Center" HorizontalAlignment="Center" FontFamily="Marlett" Text="r"/>
                                                        </Border>
                                                    </ControlTemplate>
                                                </Button.Template>
                                                <Button.Style>
                                                    <Style TargetType="Button">
                                                        <Setter Property="Background" Value="#01FFFFFF"/>
                                                        <Setter Property="BorderBrush" Value="#01FFFFFF"/>
                                                        <Style.Triggers>
                                                            <Trigger Property="Button.IsMouseOver" Value="True">
                                                                <Setter Property="Button.BorderBrush" Value="Red"/>
                                                                <Setter Property="Background" Value="#10FF0000"/>
                                                            </Trigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </Button.Style>
                                            </Button>
                                        </StackPanel>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="Header" Value="{Binding DisplayName}"/>
                            <Setter Property="Content" Value="{Binding}"/>
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                    <DataTemplate>
                                        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" >
                                            <ContentPresenter Content="{Binding DesignerCanvas}"/>
                                        </ScrollViewer>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style.Setters>
                    </Style>
                </TabControl.ItemContainerStyle>
            </TabControl>
            <!--</ScrollViewer>
            </GroupBox>-->
            <!-- GridSplitter -->
            <GridSplitter Focusable="False" Width="2" Background="LightGray" Grid.Column="1"
                   ResizeDirection="Columns" VerticalAlignment="Stretch" HorizontalAlignment="Right"/>
            <!-- PropertyGrid -->
            <StackPanel Grid.Column="2">
                <Expander Header="Properties" Grid.Row="0"  Margin="3,0,0,0" IsExpanded="True">
                    <ScrollViewer HorizontalScrollBarVisibility="Auto"
                      VerticalScrollBarVisibility="Auto">
                        <slg:PropertyGrid Grid.Row="0" Filter="Prop_" x:Name="propertyGrid" />
                    </ScrollViewer>
                </Expander>
                <Expander Header="Metadatas" Grid.Row="1" Margin="3,0,0,0" IsExpanded="True">
                    <ScrollViewer HorizontalScrollBarVisibility="Auto"
                      VerticalScrollBarVisibility="Auto">
                        <control:MetadataControl   x:Name="metadataControl"/>
                    </ScrollViewer>
                </Expander>
            </StackPanel>
        </Grid>
    </Grid>
</Fluent:RibbonWindow>
